const RoleIndex = {
    template: "#roleIndex",
    components:{
        'add-role-modal': AddRoleModal,
        'updated-role-modal': UpdatedRoleModal,
        'relation-role-modal': RelationRoleModal,
    },
    data(){
        return {
            tableData: [
                {
                    code:'000',
                    name: '超级管理员',
                    createDateTime: "2020-11-20 10:24:00",
                    updateDateTime: "2020-12-25 22:44:59"
                }, {
                    code:'001',
                    name: '管理员',
                    createDateTime: "2020-11-20 10:24:00",
                    updateDateTime: "2020-02-25 22:44:59"
                }, {
                    code:'002',
                    name: '普通用户',
                    createDateTime: "2020-11-20 10:24:00",
                    updateDateTime: "2020-0101 22:44:59"
                }, {
                    code:'003',
                    name: '一般用户',
                    createDateTime: "2020-11-20 10:24:00",
                    updateDateTime: "2020-0101 22:44:59"
                }],
            isOnlineShow: 0,
            currentPage: 1,
            totalCount: 400,
            searchInfo: {
                seaInfo: "",
                startDate: "",
                endDate: "",
                searchAllDate: ""
            },
            isAddRoleShowModal: false,
            isUpdatedRoleShowModal: false,
            isRelationRoleShowModal: false,
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            }
        }
    },
    methods: {
        //收到子组件模态框关闭事件，重置状态值
        relationRoleModalClose: function() {
            this.isRelationRoleShowModal = false;
        },
        //双击表格事件，显示关联用户模态框
        doubleClickRoleTableHandle: function(row, column, event){
            console.log(row, column, event);
            this.isRelationRoleShowModal = true;
        },
        //確定刪除
        confirmDeleteRoleHandle: function(e,index,row){
            console.log(e,index,row);
        },
        updatedRoleModalColse: function(){
            this.isUpdatedRoleShowModal = false;
        },
        addRoleModalColse: function(){
            this.isAddRoleShowModal = false;
        },
        handleEdit: function (e,index,row) {
            console.log(e,index,row);
            this.isUpdatedRoleShowModal = true;
        },
        handleDelete: function (e,index,row) {
            console.log(e,index,row);
        },
        addRoleBtnHandle: function(){
            if(!this.isAddRoleShowModal){
                this.isAddRoleShowModal = true;
            }
        },
        handleEnter: function (e) {
            console.log(this.searchInfo);
        },
        pickHandle: function (e) {
            if(this.searchInfo.searchAllDate.length<=0){
                this.searchInfo.startDate="";
                this.searchInfo.endDate=""
                return ;
            }
            this.searchInfo.startDate = this.searchInfo.searchAllDate[0];
            this.searchInfo.endDate = this.searchInfo.searchAllDate[1];
            console.log(this.searchInfo.searchAllDate);
        },
        handleChange: function (e) {
            console.log(e);
        },
        handleSizeChange: function (val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange: function (val) {
            console.log(`当前页: ${val}`);
        }
    }
};